<template>
  <div>
    <mavon-editor
      v-model="marContent"
      ref="md"
      @change="change"
      style="min-height: 600px"
    />
  </div>
</template>

<script>
import { mavonEditor } from "mavon-editor";
import "mavon-editor/dist/css/index.css";
export default {
  components: {
    mavonEditor
  },
  props: ["content"],
  data() {
    return {
      marContent:"", // 输入的markdown
      html: "", // 及时转的html
    };
  },
  mounted(){
      if(this.content){
          this.marContent=this.content;
      }
  },
  methods: {
    // 所有操作都会被解析重新渲染
    change(value, render) {
      this.html = render;
    },
    getMarkDownVal() {
      return {
        html: this.html,
        content: this.marContent
      };
    }
  }
};
</script>
